<template>
  <div :class="{'mobile-create': showMobilePage}" class="create-mengli-order">
    <createIpOrder v-if="orderType === '0'" />
    <createEmojiOrder v-if="orderType === '1'" />
    <createCommerceOrder v-if="orderType === '2'" />
    <editCommerceOrderOnline v-if="orderType === '21'" />
    <createAfterSale v-if="orderType === '3'" />
    <createOrder v-if="orderType === '4'" />
  </div>
</template>

<script>
import createIpOrder from './createIpOrder';
import createEmojiOrder from './createEmojiOrder';
import createCommerceOrder from './createCommerceOrder';
import editCommerceOrderOnline from './editCommerceOrderOnline';
import createOrder from './createOrder';
import createAfterSale from './createAfterSale';
import mobileCreate from '@/mixins/mobileCreate';

export default {
  components: { createIpOrder, createEmojiOrder, createCommerceOrder, createOrder,
    editCommerceOrderOnline, createAfterSale },
  mixins: [mobileCreate],
  data() {
    return {
      orderType: ''
    };
  },
  created() {
    this.orderType = String(this.$route.query.type) || '0';
  }
};
</script>

<style lang="scss" scoped>
.create-mengli-order {
  margin: 16px;
  &::v-deep {
    .color999 {
      .el-form-item__label {
        color: #999;
      }
    }
  }
}
</style>
